<template>
	<view>
		<uni-list>
			<!-- <uni-list-item v-for="(item,index) in list"
			:key="index" :title="item.title" :note="item.typeName" :rightText="item.price + ''"
			:to="`./editAccount?bid=` + item.bid">
				<template v-slot:actions>
					<view class="f">
						<uni-dateformat class="dateform" :date="item.payTime*1000" format="yyyy年MM月dd日"></uni-dateformat>
						<uni-tag text="标签" :type="item.type=== 1? 'primary' : 'success' " :circle="true"></uni-tag>
						<view>￥{{ item.price}}</view>
					</view>
				</template>
			</uni-list-item> -->
			<uni-list-item style="height: 140rpx; margin: 20rpx 0;"
			 v-for="(item,index) in list" :key="index" :to="`./editAccount?bid=` + item.bid">
				<view style="display: flex; flex-direction: column; width: 600rpx;">
					<view style="font-size: 40rpx; margin: 25rpx 0 20rpx 0; font-family: Georgia;">
						{{item.title}}
					</view>
					<view>
						<uni-tag size="small" :text="item.typeName" :type="item.type=== 1? 'primary' : 'success' " :circle="true"></uni-tag>
					</view>
				</view>
				<view style="width: 100%; font-size: 35rpx;">
					<uni-dateformat class="dateform" :date="item.payTime*1000" format="yyyy年MM月dd日"></uni-dateformat>
				</view>
				<view style="display: flex; justify-content: flex-end; width: 150rpx; font-size: 35rpx;">
					￥{{ item.price}}
				</view>
			</uni-list-item>
		</uni-list>
		<view class="uni-loadmore" @click="getMore()">{{loadMoreText}}</view>
		<!-- 提示信息弹窗 -->
		<uni-popup ref="message" type="message">
			<uni-popup-message :type="msg.msgType" :message="msg.messageText" :duration="2000"></uni-popup-message>
		</uni-popup>
	</view>
</template>

<script>
	import { getList, addBill, updateBill, deleteBill } from '../../api/account.js'
	export default {
		data() {
			return {
				list: {},
				msg: {},
				total: 0,
				loadMoreText: "加载更多",
				// showLoadMore: false,
				queryInfo: {
					uid: this.$utils.getStorage('uid'),
					current: 1,
					size: 10,
					name: ''
				}
			}
		},
		onLoad() {
			this.getList()
		},
		onShow(){
			if(!this.$utils.isLogin()){
				uni.redirectTo({
					url: '/pages/login/login'
				});
			}
			this.getList()
		},
		// 页面触底函数
		onReachBottom(){
			this.getMore()
		},
		methods: {
			getMore(){
				this.loadMoreText = "加载中。。。"
				this.queryInfo.size += 10
				this.getList()
			},
			getList(){
				this.showLoadMore = true
				getList(this.queryInfo).then(res => {
					if(res.code === 200){
						this.list = res.data.list
						this.total = res.data.total
						this.loadMoreText = "加载更多"
						if(this.queryInfo.size > this.total){
							this.loadMoreText = "没有更多了。。。"
						}
					}else{
						if(res.code === 502){
							uni.redirectTo({
							    url: '/pages/login/login'
							});
						}
						this.msg = this.$utils.messageError(res.msg)
						this.$refs.message.open()
					}
				}).catch(reason => {
					console.log(reason)
				})
			}
		}
	}
</script>

<style scoped>
.dateform{
	margin-right: 20px;
	color: #3A3A3A;
}
</style>
